<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"> 

	<h:head>
		<title>Using h:dataTable</title>
		<link rel="stylesheet" type="text/css" href="./css/styles.css" />
		<link rel="stylesheet" type="text/css" href="./css/table-styles.css"/>
	</h:head> 
	<h:body> 
		<table border="5" align="center" >
			<tr>
				<th class="title">Using h:dataTable</th>
			</tr>
		</table>
		
		<p/>
		
		<p>
			When your goal is to build an HTML table from the data,
			h:dataTable often gives you enough flexibility 
			with simpler code than explicitly using ui:repeat.
		</p>
		
		<h:dataTable var="programmer"
					 value="#{company2.programmers}"
					 border="1"
					 styleClass="mainTable"
					 headerClass="heading"
					 rowClasses="evenRow,oddRow">
			<h:column>
				<f:facet name="header">First Name</f:facet>
				#{programmer.firstName}
			</h:column>
			<h:column>
				<f:facet name="header">Last Name</f:facet>
				#{programmer.lastName}
			</h:column>
			<h:column>
				<f:facet name="header">Experience Level</f:facet>
				#{programmer.level}
			</h:column>
			<h:column>
				<f:facet name="header">Languages</f:facet>
				#{programmer.languageList1}
			</h:column>
		</h:dataTable>
		
	</h:body> 
</html>
